<template>
  <div style="width: 500px; float: left">
    <el-row class="tac">
      <el-col :span="12">
        <h3 style="float: left">金融供应链系统</h3>
        <h3 @click="quit()" style="color: red">退出</h3>
        <el-menu
          default-active="2"
          class="el-menu-vertical-demo"
          @open="handleOpen"
          @close="handleClose"
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b"
        >
          <el-submenu index="1">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>系统管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="user"
                ><el-menu-item index="1-1"
                  ><i class="el-icon-user-solid"></i>用户管理</el-menu-item
                ></router-link
              >
              <router-link to="permission"
                ><el-menu-item index="1-2"
                  ><i class="el-icon-setting"></i>权限管理</el-menu-item
                ></router-link
              >
              <router-link to="changePwd"
                ><el-menu-item index="1-3"
                  ><i class="el-icon-setting"></i>系统设置</el-menu-item
                ></router-link
              >
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="2">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>贷后管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="repayment_manage"><el-menu-item index="2-2">还款管理</el-menu-item></router-link>
              <router-link to="repayment_protection"><el-menu-item index="2-3">资产保全</el-menu-item></router-link>
              <router-link to="repayment_reminder"><el-menu-item index="2-4">逾期催收管理</el-menu-item></router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="3">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>合同管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="contract">
                <el-menu-item index="3-1">合同展示</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="4">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>审核</span>
            </template>
            <el-menu-item-group>
              <router-link to="loan_approval">
                <el-menu-item index="4-1">审核展示</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="5">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>客户管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="business"><el-menu-item index="5-1">企业管理</el-menu-item></router-link>            
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="7">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>担保物管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="collateral"><el-menu-item index="7-1">担保物管理</el-menu-item></router-link>            
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="8">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>贷前管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="preloan"><el-menu-item index="8-1">贷前管理</el-menu-item></router-link>            
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="6">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>授信审批</span>
            </template>
            <el-menu-item-group>
              <router-link to="activiti"><el-menu-item index="6-1">流程展示</el-menu-item></router-link>         
              <router-link to="enterpriseCredit"><el-menu-item index="6-2">发起申请</el-menu-item></router-link>       
              <router-link to="task"><el-menu-item index="6-3">审核</el-menu-item></router-link>         
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="9">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>用信管理</span>
            </template>
            <el-menu-item-group>
              <router-link to="core_credit_used">
                <el-menu-item index="9-1">核心企业用信管理</el-menu-item>
              </router-link>
            </el-menu-item-group>
            <el-menu-item-group>
              <router-link to="guarantee">
                <el-menu-item index="9-2">上下游企业用信管理</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import menu from "@/components/Menu.vue";
export default {
  name: "v-menu",
  components: {
    "v-menu": menu
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    quit() {
      localStorage.clear();
      this.$router.push("/login");
    },
  },
};
</script>

<style>
.menu {
  width: 194px !important;

  background-color: #f3fbfe;
  border-radius: 0.1rem;
  margin: 0 0 0 0.4rem;
  margin-bottom: 0.5rem;
  overflow-y: auto;
  overflow-x: hidden;
  display: block;
  position: relative;
}
</style>